<template>
  <view>
    <Page ref="Page" bg>
      <template v-slot:default="{ page }">
        <template v-if="page">
          <view class="cu-bar bg-white solid-bottom margin-top">
            <view class="action">
              <text class="cuIcon-titles" :class="'text-' + $refs.Page.bgClass.split('-')[2]"></text>
              <text>输入中草药即可查询</text>
            </view>
            <view class="action" @click="show = true">
              <text class="cuIcon-unfold">
                <text class="text-df">{{ text }}</text>
              </text>
            </view>
          </view>
          <view class="cu-bar input">
            <input v-model.trim="text" ref="input" :focus="focus" class="my_input" confirm-type="search" placeholder="请输入中草药" type="text" @blur="focus = false" @confirm="make" />
            <text v-if="text" class="my_input_clear cuIcon-roundclosefill" @click="(text = ''), make()"></text>
            <button class="cu-btn lg shadow-blur" :class="'bg-' + $refs.Page.bgClass.split('-')[2]" @click="make">查询</button>
          </view>
          <view class="cu-bar solid-bottom margin-top-xs">
            <view class="action">
              <text class="cuIcon-titles" :class="'text-' + $refs.Page.bgClass.split('-')[2]"></text>
              <text class="text-bold">查询结果</text>
            </view>
            <view class="action" @click="$copy(result)">
              <text class="cuIcon-copy margin-left-xs text-bold"></text>
            </view>
          </view>
          <TextBoard :result="result" arrayView indent />
        </template>
        <page-container :show="show" :z-index="999999999" round @afterleave="show = false">
          <view style="height: 55.5vh">
            <view class="cu-list menu card-menu sm-border shadow radius-lg">
              <view class="cu-bar">
                <view class="action">
                  <text class="text-bold">请选择中草药</text>
                </view>
                <view class="flex" style="width: 42rpx; height: 42rpx" @click="show = false">
                  <text class="cuIcon-close"></text>
                </view>
              </view>
            </view>
            <view class="padding margin-bottom" style="height: 61.8vh; overflow: auto; padding-bottom: 300px">
              <view v-for="item in list" :key="item" class="cu-tag radius margin-xs" style="font-size: 30rpx" @click="(text = item), make(), (show = false)">{{ item }}</view>
            </view>
          </view>
        </page-container>
      </template>
    </Page>
  </view>
</template>

<script>
export default {
  data() {
    return {
      show: false,
      text: uni.getStorageSync("caoyao") || "人参",
      focus: true,
      result: null,
      list: [
        "人参",
        "人发",
        "卜芥",
        "儿茶",
        "八角",
        "丁香",
        "刀豆",
        "三七",
        "三棱",
        "干姜",
        "干漆",
        "广白",
        "广角",
        "广丹",
        "大黄",
        "大戟",
        "大枣",
        "大蒜",
        "大蓟",
        "小蓟",
        "小麦",
        "小蘖",
        "山丹",
        "山茶",
        "山奈",
        "山香",
        "山枣",
        "山栀",
        "山姜",
        "山药",
        "山楂",
        "川羌",
        "川军",
        "川连",
        "川朴",
        "川乌",
        "川柏",
        "川谷",
        "川断",
        "川椒",
        "川贝",
        "川芎",
        "马兰",
        "马辛",
        "马菜",
        "马莲",
        "马宝",
        "马勃",
        "马蔺",
        "卫茅",
        "子苓",
        "天冬",
        "天虫",
        "天龙",
        "天雄",
        "天麻",
        "元胡",
        "元参",
        "木瓜",
        "木耳",
        "木莲",
        "木香",
        "木通",
        "木贼",
        "木豆",
        "木笔",
        "木蓝",
        "牙皂",
        "瓦松",
        "瓦韦",
        "贝子",
        "贝母",
        "贝齿",
        "牛至",
        "牛黄",
        "牛膝",
        "牛蒡",
        "见愁",
        "手参",
        "毛鸡",
        "毛茛",
        "毛姜",
        "升麻",
        "升登",
        "丹砂",
        "丹皮",
        "丹参",
        "乌茜",
        "乌韭",
        "乌药",
        "乌头",
        "乌桕",
        "乌梅",
        "方海",
        "六曲",
        "文元",
        "文蛤",
        "仁杞",
        "双花",
        "双皮",
        "水花",
        "水萍",
        "水韭",
        "水莽",
        "水蛭",
        "巴豆",
        "玉桂",
        "玉竹",
        "玉金",
        "甘松",
        "甘草",
        "甘遂",
        "艾叶",
        "艾片",
        "艾蒿",
        "石韦",
        "石耳",
        "石灰",
        "石斛",
        "石膏",
        "石榴",
        "石燕",
        "石竹",
        "石蜜",
        "龙胆",
        "龙齿",
        "龙骨",
        "龙葵",
        "龙脑",
        "龙眼",
        "归尾",
        "田螺",
        "申姜",
        "生地",
        "生姜",
        "生军",
        "仙茅",
        "及巳",
        "片苓",
        "白及",
        "白芨",
        "白求",
        "白术",
        "白芍",
        "白芷",
        "白英",
        "白矾",
        "白果",
        "白前",
        "白丑",
        "白参",
        "白苏",
        "白降",
        "白蜜",
        "白蔻",
        "白蔹",
        "白微",
        "玄参",
        "半夏",
        "地龙",
        "地黄",
        "地椒",
        "地榆",
        "地笋",
        "地锦",
        "杞子",
        "朴硝",
        "芒硝",
        "朴硝",
        "西瓜",
        "西羌",
        "列当",
        "百合",
        "百部",
        "当归",
        "当药",
        "中草",
        "曲莲",
        "肉桂",
        "肉果",
        "朱砂",
        "向前",
        "竹叶",
        "竹苓",
        "竹沥",
        "竹菇",
        "竹黄",
        "血余",
        "血蝎",
        "全蝎",
        "全参",
        "全草",
        "合欢",
        "合萌",
        "守宫",
        "冰片",
        "决明",
        "米仁",
        "羊角",
        "羊乳",
        "羊蹄",
        "灯草",
        "防己",
        "防风",
        "红花",
        "红根",
        "红粉",
        "红参",
        "红糖",
        "红藤",
        "红升",
        "豆豉",
        "麦冬",
        "麦芽",
        "赤芍",
        "赤药",
        "赤箭",
        "芫花",
        "芫荽",
        "苁蓉",
        "砂仁",
        "花椒",
        "芥子",
        "苍术",
        "芜荑",
        "芹菜",
        "芡实",
        "芦荟",
        "芦根",
        "芦丁",
        "苏子",
        "苏木",
        "苏叶",
        "杏仁",
        "杠板",
        "杜仲",
        "杜衡",
        "杜松",
        "辰砂",
        "园参",
        "旱芹",
        "旱莲",
        "岗松",
        "岗梅",
        "牡蛎",
        "杜桂",
        "皂角",
        "佛手",
        "佛片",
        "条苓",
        "龟甲",
        "龟板",
        "忘忧",
        "辛夷",
        "良姜",
        "谷芽",
        "羌活",
        "远志",
        "连翘",
        "沙参",
        "沙棘",
        "沉香",
        "没药",
        "诃子",
        "没石",
        "陆英",
        "灵芝",
        "鸡头",
        "阿胶",
        "阿魏",
        "陈皮",
        "附子",
        "青皮",
        "青果",
        "青蒿",
        "青黛",
        "苦木",
        "苦参",
        "苦菜",
        "苦酒",
        "茄根",
        "苡仁",
        "茅莓",
        "茅根",
        "枇杷",
        "松节",
        "松音",
        "松脂",
        "松塔",
        "松醇",
        "郁金",
        "虎仗",
        "虎刺",
        "虎骨",
        "果导",
        "昆布",
        "岩陀",
        "知母",
        "侧柏",
        "乳香",
        "灸草",
        "佩兰",
        "狗宝",
        "狗脊",
        "迭达",
        "夜合",
        "京墨",
        "官桂",
        "空青",
        "卷柏",
        "卷丹",
        "油葱",
        "法夏",
        "泽兰",
        "泽泻",
        "泡参",
        "降香",
        "饴糖",
        "细辛",
        "玳瑁",
        "珍珠",
        "荆芥",
        "茜草",
        "荜拔",
        "草乌",
        "草果",
        "茶油",
        "茵陈",
        "茯苓",
        "茯神",
        "荠菜",
        "荠草",
        "莎草",
        "莽草",
        "药芹",
        "茴香",
        "胡桃",
        "胡椒",
        "南星",
        "南藤",
        "枯矾",
        "枯草",
        "枯苓",
        "柳叶",
        "柳芽",
        "柳枝",
        "枳壳",
        "枳实",
        "桅子",
        "枸杞",
        "柿蒂",
        "柿霜",
        "厚朴",
        "砂仁",
        "砂糖",
        "砒石",
        "砒霜",
        "轻粉",
        "虻虫",
        "胎盘",
        "将军",
        "钩藤",
        "钩吻",
        "香附",
        "香橼",
        "香嵩",
        "香茹",
        "香薷",
        "重楼",
        "胆木",
        "胆矾",
        "胆星",
        "脉通",
        "独活",
        "信石",
        "鬼珠",
        "鬼白",
        "鬼刺",
        "鬼针",
        "食盐",
        "炮姜",
        "姜黄",
        "姜汁",
        "姜皮",
        "前胡",
        "首乌",
        "洪连",
        "扁豆",
        "扁蓄",
        "扁蕾",
        "神曲",
        "蚤休",
        "贯众",
        "贯仲",
        "秦艽",
        "秦皮",
        "莲子",
        "莲肉",
        "莲房",
        "莲芯",
        "莲须",
        "莪术",
        "荷叶",
        "荷蒂",
        "荷梗",
        "桂心",
        "桂枝",
        "荸荠",
        "莎草",
        "恶实",
        "桔梗",
        "桃仁",
        "桃汁",
        "盐蛇",
        "柴胡",
        "崖香",
        "党参",
        "蚌花",
        "铁屑",
        "铝丹",
        "蚕砂",
        "射干",
        "豹骨",
        "狼毒",
        "拳参",
        "益智",
        "海马",
        "海龙",
        "海芋",
        "海藻",
        "海蛰",
        "浮石",
        "浮萍",
        "通天",
        "通草",
        "桑叶",
        "桑枝",
        "桑皮",
        "桑椹",
        "黄芩",
        "黄芪",
        "黄连",
        "黄栌",
        "黄柏",
        "黄精",
        "黄藤",
        "黄丹",
        "黄独",
        "黄杞",
        "黄宣",
        "黄蜡",
        "黄蘖",
        "菱角",
        "菖蒲",
        "菊苣",
        "菊花",
        "营实",
        "萝卜",
        "菘蓝",
        "梅花",
        "梅仁",
        "梅片",
        "雪胆",
        "常山",
        "野姜",
        "野艾",
        "野菊",
        "野菱",
        "蛇肉",
        "蛇蜕",
        "蛇莓",
        "蚯蚓",
        "银杏",
        "银耳",
        "银花",
        "银翘",
        "猪苓",
        "兜铃",
        "麻油",
        "麻黄",
        "麻仁",
        "鹿角",
        "鹿茸",
        "商陆",
        "商枝",
        "续断",
        "绥草",
        "缘豆",
        "琥珀",
        "斑蛰",
        "斑蟊",
        "葫芦",
        "葱白",
        "葛根",
        "葛花",
        "扁蓄",
        "落葵",
        "栗壳",
        "硫磺",
        "雄黄",
        "喜树",
        "椒目",
        "棕板",
        "掌参",
        "紫苏",
        "紫萍",
        "紫芝",
        "紫草",
        "紫苑",
        "紫株",
        "紫绀",
        "紫葳",
        "蛤壳",
        "蛤蚧",
        "黑丑",
        "黑锡",
        "黑钻",
        "黑菜",
        "锁阳",
        "象贝",
        "奥尕",
        "猴头",
        "滑石",
        "寒水",
        "童便",
        "犀角",
        "蒺藜",
        "蒲黄",
        "蒲芹",
        "椿皮",
        "槐米",
        "槐实",
        "槐花",
        "槐角",
        "硼砂",
        "雷丸",
        "蜀椒",
        "蜈蚣",
        "蜂房",
        "蜂蜡",
        "蜂蜜",
        "腰黄",
        "锦纹",
        "腹皮",
        "榧子",
        "槟榔",
        "酸浆",
        "酸模",
        "碱花",
        "磁石",
        "豆姜",
        "蝉衣",
        "熊胆",
        "蝉蜕",
        "辣蓼",
        "赭石",
        "蕤仁",
        "蕲蛇",
        "樟脑",
        "稻芽",
        "僵蚕",
        "蝼蛄",
        "鲤鱼",
        "熟地",
        "漏芦",
        "鹤虱",
        "薤白",
        "薯莨",
        "薄荷",
        "橘白",
        "橘皮",
        "橘红",
        "橘核",
        "燕窝",
        "靛蓝",
        "糙苏",
      ],
    };
  },
  onLoad() {
    this.make();
  },
  methods: {
    make() {
      this.focus = false;
      this.result = null;
      this.text = (this.text || "").toString().trim();
      if (this.text) {
        this.$loading();
        uni
          .request({
            url: "https://api.tangdouz.com/a/zcy.php?nr=" + this.text,
          })
          .then(({ data }) => {
            this.result = data.split("\\r").filter(e => e);
          })
          .finally(() => this.$loaded());
      } else {
        this.focus = true;
        this.$toast("请输入中草药");
      }
      uni.setStorageSync("caoyao", this.text || "");
    },
  },
};
</script>

<style lang="scss" scoped></style>
